﻿@model Tuple<Device,List<DeviceType>, List<Depart>,List<Room>, List<Project>,
            List<BuyContract>, 
            Tuple<List<ServiceContract>,List<Supplier>, List<DeviceTypeCategory>>>
@{
    ViewData["Title"] = "设备入库";
}
<style>
    .layui-layout-body {
        overflow: auto;
    }
    .layadmin-carousel .layui-carousel-ind {
        position: absolute;
        top: -53px;
        text-align: right;
        width: 100px;
        margin-left: 149px;
    }

    .layui-carousel .layui-row {
        text-align: center;
    }

   .layui-carousel .layui-row img {
            width: 240px;
            height:178px;
   }

    .layui-form-label {
        width: 90px;
    }
</style>
 
       
        <div class="layui-fluid" style="padding-bottom: 85px;">
            <div class="layui-row layui-col-space15">
                <div class="layui-col-md8">
                    <div class="layui-card">
                        <div class="layui-card-header">基本信息</div>
                        <div class="layui-card-body" style="padding: 15px;">
                            <form class="layui-form" action="" lay-filter="component-form-group">
                                <input type="hidden" name="id" id="id" value="@Model.Item1.Id" />
                                <div class="layui-form-item">
                                    <div class="layui-inline">
                                        <label class="layui-form-label">设备名称</label>
                                        <div class="layui-input-inline">
                                            <input type="tel" name="Name" value="@Model.Item1.Name" lay-verify="required" autocomplete="off" class="layui-input" maxlength="100">
                                        </div>
                                    </div>
                                    <div class="layui-inline">
                                        <label class="layui-form-label">设备编码</label>
                                        <div class="layui-input-inline">
                                            <input type="text" name="deviceId" value="@Model.Item1.DeviceId" lay-verify="required" autocomplete="off" class="layui-input" maxlength="80">
                                        </div>
                                    </div>
                                </div>
                                <div class="layui-form-item">
                                    <div class="layui-inline">
                                        <label class="layui-form-label">设备类别分类</label>
                                        <div class="layui-input-inline">
                                            <select name="deviceTypeCategoryId" lay-filter="category">
                                                <option></option>
                                                @foreach (var type in Model.Item7.Item3)
                                                {
                                                    @if (Model.Item1.DeviceType != null &&
                                                       Model.Item1.DeviceType.DeviceTypeCategory != null
                                                       && type.Id.Equals(Model.Item1.DeviceType.DeviceTypeCategory.Id))
                                                    {
                                                        <option value="@type.Id" selected>@type.Name</option>
                                                    }
                                                    else
                                                    {
                                                        <option value="@type.Id">@type.Name</option>
                                                    }
                                                }
                                            </select>
                                        </div>
                                    </div>
                                    <div class="layui-inline">
                                        <label class="layui-form-label">设备类别</label>
                                        <div class="layui-input-inline">
                                            <select name="deviceTypeId" lay-filter="DeviceType" id="deviceTypeId">
                                                @foreach (var type in Model.Item2)
                                                {
                                                    @if (type.Id.Equals(Model.Item1.DeviceTypeId))
                                                    {
                                                        <option value="@type.Id" selected>@type.Name</option>
                                                    }
                                                    else
                                                    {
                                                        <option value="@type.Id">@type.Name</option>
                                                    }
                                                }
                                            </select>
                                        </div>
                                    </div>

                                </div>
                                <div class="layui-form-item">
                                    <div class="layui-inline">
                                        <label class="layui-form-label">规格型号</label>
                                        <div class="layui-input-inline" style="width:524px;">
                                            <input type="text" name="Model" autocomplete="off" class="layui-input" value="@Model.Item1.Model">
                                        </div>
                                    </div>
                                </div>
                                <div class="layui-form-item">

                                    <div class="layui-inline">
                                        <label class="layui-form-label">是否国产</label>
                                        <div class="layui-input-inline">
                                            @if (Model.Item1.IsDomestic == 1)
                                            {
                                                <input type="radio" name="IsDomestic" value="1" title="是" checked>
                                                <input type="radio" name="IsDomestic" value="0" title="否">
                                            }
                                            else
                                            {
                                                <input type="radio" name="IsDomestic" value="1" title="是">
                                                <input type="radio" name="IsDomestic" value="0" title="否" checked>
                                            }
                                        </div>
                                    </div>
                                    <div class="layui-inline">
                                        <label class="layui-form-label">固定资产编号</label>
                                        <div class="layui-input-inline">
                                            <input type="text" name="No" lay-verify="required" value="@Model.Item1.No" autocomplete="off" class="layui-input" maxlength="50">
                                        </div>
                                    </div>
                                </div>
                                <div class="layui-form-item">
                                    <div class="layui-inline">
                                        <label class="layui-form-label">部署位置</label>
                                        <div class="layui-input-inline">
                                            <select name="RoomId" lay-filter="RoomId">
                                                @foreach (var type in Model.Item4)
                                                {
                                                    @if (type.Id.Equals(Model.Item1.RoomId))
                                                    {
                                                        <option value="@type.Id" selected>@type.Name</option>
                                                    }
                                                    else
                                                    {
                                                        <option value="@type.Id">@type.Name</option>
                                                    }
                                                }
                                            </select>
                                        </div>
                                    </div>
                                    <div class="layui-inline">
                                        <label class="layui-form-label">摆放位置</label>
                                        <div class="layui-input-inline">
                                            <input type="text" name="Location" value="@Model.Item1.Location" autocomplete="off" class="layui-input" maxlength="60">
                                        </div>
                                    </div>
                                </div>
                                <div class="layui-form-item">
                                    <div class="layui-inline">
                                        <label class="layui-form-label">所属项目</label>
                                        <div class="layui-input-inline">
                                            <select name="ProjectId">
                                                @foreach (var type in Model.Item5)
                                                {
                                                    @if (type.Id.Equals(Model.Item1.ProjectId))
                                                    {
                                                        <option value="@type.Id" selected>@type.Name</option>
                                                    }
                                                    else
                                                    {
                                                        <option value="@type.Id">@type.Name</option>
                                                    }
                                                }
                                            </select>
                                        </div>
                                    </div>
                                    <div class="layui-inline">
                                        <label class="layui-form-label">IP地址</label>
                                        <div class="layui-input-inline">
                                            <input type="text" name="Ip" autocomplete="off" class="layui-input" value="@Model.Item1.Ip" maxlength="25">
                                        </div>
                                    </div>
                                </div>
                                <div class="layui-form-item">
                                    <div class="layui-inline">
                                        <label class="layui-form-label">采购日期</label>
                                        <div class="layui-input-inline">
                                            <input type="text" name="buyDate" id="buyDate" readonly autocomplete="off"
                                                   class="layui-input date" value="@if(Model.Item1.BuyDate != null){@Model.Item1.BuyDate.Value.ToString().Substring(0, 10); } ">
                                        </div>
                                    </div>
                                    <div class="layui-inline">
                                        <label class="layui-form-label">接管日期</label>
                                        <div class="layui-input-inline">
                                            <input type="text" name="ReceiveDate" id="receiveDate" readonly autocomplete="off"
                                                   class="layui-input date" value="@if(Model.Item1.ReceiveDate != null){@Model.Item1.ReceiveDate.Value.ToString().Substring(0, 10); } ">
                                        </div>
                                    </div>
                                </div>
                                <div class="layui-form-item">
                                    <div class="layui-inline">
                                        <label class="layui-form-label">供应商</label>
                                        <div class="layui-input-inline">
                                            <select name="SupplierId" lay-filter="DepartId">
                                                @foreach (var type in Model.Item7.Item2)
                                                {
                                                    @if (type.Id.Equals(Model.Item1.SupplierId))
                                                    {
                                                        <option value="@type.Id" selected>@type.Name</option>
                                                    }
                                                    else
                                                    {
                                                        <option value="@type.Id">@type.Name</option>
                                                    }
                                                }
                                            </select>
                                        </div>
                                    </div>
                                    <div class="layui-inline">
                                        <label class="layui-form-label">在保日期</label>
                                        <div class="layui-input-inline">
                                            <input type="text" name="ServiceDate" id="serviceDate" readonly autocomplete="off"
                                                   class="layui-input date" value="@if (Model.Item1.ServiceDate != null) { @Model.Item1.ServiceDate.ToString().Substring(0, 10); } ">
                                        </div>
                                    </div>
                                </div>
                                <div class="layui-form-item">
                                    <div class="layui-inline">
                                        <label class="layui-form-label">所属部门</label>
                                        <div class="layui-input-inline">
                                            <select name="DepartId" lay-filter="DepartId">
                                                @foreach (var type in Model.Item3)
                                                {
                                                    @if (type.Id.Equals(Model.Item1.DepartId))
                                                    {
                                                        <option value="@type.Id" selected>@type.Name</option>
                                                    }
                                                    else
                                                    {
                                                        <option value="@type.Id">@type.Name</option>
                                                    }
                                                }
                                            </select>
                                        </div>
                                    </div>
                                    <div class="layui-inline">
                                        <label class="layui-form-label">项目建设部门</label>
                                        <div class="layui-input-inline">
                                            <input type="text" name="owner_unit" value="@Model.Item1.owner_unit" autocomplete="off" class="layui-input" maxlength="60">
                                        </div>
                                    </div>
                                </div>
                                <div class="layui-form-item">
                                    <div class="layui-inline">
                                        <label class="layui-form-label">操作系统</label>
                                        <div class="layui-input-inline">
                                            <input type="text" name="Os" value="@Model.Item1.Os" autocomplete="off" class="layui-input" maxlength="60">
                                        </div>
                                    </div>
                                </div>
                                    <div class="layui-form-item">
                                        <div class="layui-inline">
                                            <label class="layui-form-label">采购合同</label>
                                            <div class="layui-input-inline" style="width:450px;">
                                                <select name="BuyContractId" lay-filter="BuyContractId" lay-search>
                                                    @foreach (var type in Model.Item6)
                                                    {
                                                        @if (type.Id.Equals(Model.Item1.BuyContractId))
                                                        {
                                                            <option value="@type.Id" selected>@type.Title</option>
                                                        }
                                                        else
                                                        {
                                                            <option value="@type.Id">@type.Title</option>
                                                        }
                                                    }
                                                </select>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="layui-form-item">
                                        <div class="layui-inline">
                                            <label class="layui-form-label">维护合同</label>
                                            <div class="layui-input-inline" style="width:450px;">
                                                <select name="ServiceContract" lay-filter="ServiceContract" lay-search>
                                                    @foreach (var type in Model.Item7.Item1)
                                                    {
                                                        @if (type.Id.Equals(Model.Item1.ServiceContract))
                                                        {
                                                            <option value="@type.Id" selected>@type.Title</option>
                                                        }
                                                        else
                                                        {
                                                            <option value="@type.Id">@type.Title</option>
                                                        }
                                                    }
                                                </select>
                                            </div>
                                        </div>
                                    </div>
                                    <!--
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">运维计划</label>
                <div class="layui-input-inline" style="width:450px;">
                    <select multiple="multiple" lay-filter="test">
                        <option value=""></option>
                    </select>
                </div>
            </div>
        </div>
            -->
                                    <div class="layui-form-item">
                                        <div class="layui-inline">
                                            <label class="layui-form-label">备注信息</label>
                                            <div class="layui-input-inline" style="width:450px;">
                                                <textarea name="remark" placeholder="请输入" class="layui-textarea">@Model.Item1.Remark</textarea>
                                            </div>
                                        </div>
                                    </div>

                                    <div>

                                        <div class="layui-footer">
                                            @if (Model.Item1.IsEdit)
                                            {
                                                <button class="layui-btn" lay-submit="" lay-filter="saveAndAdd">保存&添加同类设备</button>
                                                <button class="layui-btn" lay-submit="" lay-filter="save">保存&返回</button>
                                            }
                                            else
                                            {
                                                <button class="layui-btn" lay-submit="" lay-filter="saveAndAdd">入库&添加同类设备</button>
                                                <button class="layui-btn" lay-submit="" lay-filter="save">入库&返回</button>
                                            }
                                            <button type="reset" onclick="goBack()" class="layui-btn ">返回</button>
                                        </div>
                                    </div>
                            </form>
                        </div>
                    </div>
                </div>
                <div class="layui-col-md4">
                    <div class="layui-card">
                        <div class="layui-card-header">
                            设备照片
                            <button type="button" class="layui-btn layui-btn-xs" id="uploadPicBtn" style="margin-left:20px;">
                                <i class="layui-icon layui-icon-upload-drag"></i>上传
                            </button>
                        </div>
                        <div class="layui-card-body" style="padding: 15px;">
                            <div class="layui-card-body">

                                <div class="layui-carousel layadmin-carousel layadmin-shortcut" id="imageList" lay-anim="" lay-indicator="inside" lay-arrow="none" style="width: 100%; height: 280px;">
                                    <div carousel-item="" id="imageListItem">                                       
                                    </div>
                                </div>

                            </div>
                        </div>
                    </div>
                    <div class="layui-card">
                        <div class="layui-card-header">
                            相关资料
                            <button type="button" class="layui-btn layui-btn-xs" id="uploadBtn" style="margin-left:20px;">
                                <i class="layui-icon layui-icon-upload-drag"></i>上传
                            </button>
                        </div>
                        <div class="layui-card-body" style="padding: 15px;">
                            <table class="layui-table layuiadmin-page-table" id="fileTable" lay-skin="line"></table>
                        </div>
                    </div>
                </div>

            </div>
        </div>
  
<script>

    var $ = layui.$
        , admin = layui.admin
        , element = layui.element
        , layer = layui.layer
        , laydate = layui.laydate
        , table = layui.table
        , upload = layui.upload
        , form = layui.form
        , carousel = layui.carousel
        , laydate = layui.laydate
        , multiSelect = layui.multiSelect;

    form.render(null, 'component-form-group');
    laydate.render({
        elem: '#LAY-component-form-group-date'
    });

    layui.config({
        base: '/js/',
    })
    layui.use(['multiSelect'], function () {
        var $ = layui.jquery, form = layui.form, multiSelect = layui.multiSelect;
    });

     

    //加载图片
    function loadImages() {
        $.ajax({
            url: "/doc/getAllByObjectId?category=1&id=@Model.Item1.Id",
            success: function (d) {
                
                var data = d.data;
                var html = "";
                for (var i = 0; i < data.length; i++) {
                    if (i == 0) {
                        html += '<div class="layui-row layui-col-space10 layui-this">'
                    } else {
                        html += '<div class="layui-row layui-col-space10 ">'
                    }
                    html += '<img src="/doc/download?id=' + data[i].id + '" />'; 
                    html += '<a style="margin-top:-60px;" class="layui-btn layui-btn-danger layui-btn-xs" onclick="deleteImgItem(\'' + data[i].id+'\')"><i class="layui-icon layui-icon-delete"></i>删除</a> ';
                    html += '</div>';                
                }
                $('#imageListItem').html(html);

                //渲染幻灯片
                carousel.render({
                    elem: '#imageList'
                    , width: '100%' //设置容器宽度
                    , arrow: 'always' //始终显示箭头
                });
            }
        });
    }
    loadImages();


    /* 监听提交 */
    form.on('submit(save)', function (data) {
        //开始保存合同信息
        $.post("/DeviceInfo/save", data.field,
            function (e) {
                layer.msg(e.msg);
                if (e.code == 1) { //保存成功
                    window.parent.deviceTable.reload();
                    window.parent.layer.close(window.parent.winIndex);
                }
         });
        return false;
    });

    //保存并继续添加
    form.on('submit(saveAndAdd)', function (data) {
        //开始保存合同信息
        $.post("/DeviceInfo/save", data.field,
            function (e) {
                layer.msg(e.msg);
                if (e.code == 1) { //保存成功
                    window.location.href = "/DeviceInfo/copy?id=@Model.Item1.Id";
                }
            });
        return false;
    });

    function goBack() {
        window.parent.layer.close(window.parent.winIndex);
    }


    //上传文件
    var id = $('#id').val();
    upload.render({
        elem: "#uploadBtn" //绑定元素
        , url: '/doc/upload?category=0&key=' + id //上传接口
        , accept: 'file'
        , done: function (res) {
            layer.msg(res.msg);
            if (res.code == 1) tableObj.reload();//上传成功，刷新附件table
        }
        , error: function () {
            layer.msg("上传失败！");
        }
    });


    //上传照片
    upload.render({
        elem: "#uploadPicBtn" //绑定元素
        , url: '/doc/upload?category=1&key='+id //上传接口        
        , done: function (res) {
            layer.msg(res.msg);
            if (res.code == 1) {
                //重新加载幻灯片来显示照片
                loadImages();
            }
        }
        , error: function () {
            layer.msg("上传失败！");
        }
    });

    //加载table
    var tableObj = table.render({
        elem: '#fileTable'
        ,height:'395px'
            , url: '/doc/getAllByObjectId?&category=0&id=@Model.Item1.Id' //其他文件
            , cols: [[
                { field: 'name', title: '文件名称',  templet: '<div><a class="fileLink" href="/doc/download?id={{d.id}}">{{ d.name}}</a></div>' },
                {
                    field: 'opr', title: '操作', width: 120,
                    templet: '<div class="layui-table-cell laytable-cell-11-0-8"><a class="layui-btn layui-btn-danger layui-btn-xs" onclick="deleteItem(\'{{ d.id }}\')"><i class="layui-icon layui-icon-delete"></i>删除</a> </div> '
                }
                ]]
        , skin: 'line'
    });

    //删除照片
    function deleteImgItem(id) {
        window.parent.layer.confirm("确定要删除此照片吗？", function (index) {
            window.parent.layer.close(index);
            $.post("/doc/delete?id=" + id,
                function (res) {
                    window.parent.layer.msg(res.msg);
                    if (res.code == 1) {
                        loadImages();
                    }
                });
        });
    }

    //删除文件
    function deleteItem(id) {
        window.parent.layer.confirm("确定要删除附件吗？", function (index) {
            window.parent.layer.close(index);
            $.post("/doc/delete?id=" + id,
                function (res) {
                    window.parent.layer.msg(res.msg);
                    if (res.code == 1) {
                        tableObj.reload();
                    }
                });
        });
    }


    //最后渲染日期
    laydate.render({ elem: '#buyDate' });
    laydate.render({ elem: '#receiveDate' });
    laydate.render({ elem: '#serviceDate' });

    //监听选择    
    form.on('select(category)', function (data) {
        
        //重新加载设备类型
        $.ajax({
            url:'/deviceinfo/typeList?category='+data.value,
            dataType: 'json',
            success: function (res) {
                $('#deviceTypeId').html('');
                var html = "";
                for (var i = 0; i < res.length; i++) {
                    html += "<option value='" + res[i].id+"'>"+res[i].name+"</option>";
                }
                $('#deviceTypeId').html(html);
                form.render("select");
            }
        });
        
    });
</script>
